<script setup lang="ts">
import { RepoVO } from '@/api/exam/repo/types';
import repoDetail from '@/views/exam/template/index.vue';
import useSettingsStore from '@/store/modules/settings';
import { RouteLocationNormalized } from 'vue-router';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const route = useRoute();
const settingsStore = useSettingsStore();
const needTagsView = computed(() => settingsStore.tagsView);
const currentRepoId = ref<string>();
const repo = ref<RepoVO>(null);

const handleClose = () => {
  const obj: RouteLocationNormalized = {
    path: '/repo/list',
    fullPath: '',
    hash: '',
    matched: [],
    meta: undefined,
    name: undefined,
    params: undefined,
    query: undefined,
    redirectedFrom: undefined
  };
  proxy?.$tab.closeOpenPage(obj);
};
watch(() => currentRepoId.value, (newRepoId) => {

})

onMounted( () => {
  currentRepoId.value = route.params && route.params.repoId as string;
});
</script>

<template>
  <div :class="{ hasSecondaryTagsView: needTagsView }" class="secondary-content">
    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
                :leave-active-class="proxy?.animate.searchAnimate.leave">

    </transition>
    <repoDetail :repoId="route.params.repoId"></repoDetail>
  </div>

</template>

<style lang="scss">
.hasSecondaryTagsView {
  height: calc(100vh - 84px);
  padding-bottom: 0.5rem !important;

  .app-main {
    /* 84 = navbar + tags-view = 50 + 34 */
    display: flex;
    flex-direction: column;
  }

  .fixed-header + .app-main {
    padding-top: 84px;
  }
}
</style>
